<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>登录</title>
  <meta name="description" content="particles.js is a lightweight JavaScript library for creating particles.">
  <meta name="author" content="Vincent Garreau" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <link rel="stylesheet" media="screen" href="css/style.css">
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <link href="css/menu.css" rel="stylesheet"></head>

<body style=" background-color: #080808;">

  <!-- count particles -->
  <div class="count-particles">
    <span class="js-count-particles">--</span>
    particles
  </div>

  <!-- particles.js container -->
  <div id="particles-js"></div>

  <!-- scripts -->
  <script src="js/particles.min.js"></script>
  <script src="js/app.js"></script>

  <!-- stats.js -->
  <script src="js/lib/stats.js"></script>
  <script>
  var count_particles, stats, update;
  stats = new Stats;
  stats.setMode(0);
  stats.domElement.style.position = 'absolute';
  stats.domElement.style.left = '0px';
  stats.domElement.style.top = '0px';
  document.body.appendChild(stats.domElement);
  count_particles = document.querySelector('.js-count-particles');
  update = function() {
    stats.begin();
    stats.end();
    if (window.pJSDom[0].pJS.particles && window.pJSDom[0].pJS.particles.array) {
      count_particles.innerText = window.pJSDom[0].pJS.particles.array.length;
    }
    requestAnimationFrame(update);
  };
  requestAnimationFrame(update);
</script>
  <div class="register-next">
    <div class="login-title" style="text-align: center;">
      <a href="menu.html" style="text-decoration: none;">
        <div style="font-size: 40px;color:#F7FAFC;font-weight: bold; ">
          <span>知</span>
          <span style="margin-left:25px;">味</span>
        </div>
      </a>
      <span style="font-size: 25px;color: #F7FAFC;font-weight: bold;border-bottom:3px solid #5BC0DE;" class="btn btn-title" id="login">登录</span>
      <span style="font-size: 25px;color: #F7FAFC;font-weight: bold;margin-left: 30px;" class="btn btn-title" id="register">注册</span>
    </div>
    <div class="login">
      <div class="register-input" style="margin-top: 35px;">
        <input type="text" name="" placeholder="手机号" style="border-top-left-radius:4px;border-top-right-radius:4px;border-bottom: 1px solid #D5D5D5;" id="phone">
        <br>
        <input type="password" name="" placeholder="密码" style="border-bottom-right-radius:4px;border-bottom-left-radius:4px;" id="password">
        <br></div>
      <div class="register-btn">
        <a href="#" class="btn btn-info" style="width:100%;font-size: 25px;" id="btn-login">登录</a>
      </div>
    </div>

    <div class="register" style="display: none;">
      <div class="register-input" style="margin-top: 35px;">
        <input id="re_username" type="text" name="" placeholder="用户名" style="border-top-left-radius:4px;border-top-right-radius:4px;border-bottom: 1px solid #D5D5D5;">
        <br>
        <input id="re_password" type="password" name="" placeholder="密码" style="border-bottom: 1px solid #D5D5D5;">
        <br>
        <input id="re_password_again" type="password" name="" placeholder="确认密码" style="border-bottom: 1px solid #D5D5D5;">
        <br>
        <input id="re_phone" type="text" name="" placeholder="手机号" style="border-bottom-right-radius:4px;border-bottom-left-radius:4px; ">
        <br></div>
      <div class="register-btn">
        <a href="#" class="btn btn-info" style="width:100%;font-size: 25px;" id="btn-register">注册</a>
      </div>
    </div>
  </div>
</body>
  <script src="js/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script type="text/javascript" src="js/menu.js"></script>
  <script type="text/javascript" src="js/user_data.js"></script>
  <script type="text/javascript" src="js/jquerysession.js"></script>
</html>